<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>PGK Training System: Welcome</title>
<link href="style.css" rel="stylesheet" type="text/css" />

<script src="js/jquery.js" type="text/javascript" language="javascript"></script>

<script language="javascript">
{literal}
$(document).ready(function()
{
	$("#login_form").submit(function()
	{
		//remove all the class add the messagebox classes and start fading
		$("#msgbox").removeClass().addClass('messagebox').text('Validating....').fadeIn(1000);
		//check the username exists or not from ajax
		$.post("ajax/ajax_login.php",{ user_name:$('#username').val(),password:$('#password').val(),rand:Math.random() } ,function(data)
        {
		  if(data=='yes') //if correct login detail
		  {
		  	$("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
			{ 
			  //add message and change the class of the box and start fading
			  $(this).html('Logging in...').addClass('messageboxok').fadeTo(900,1,
              function()
			  { 
			  	 //redirect to secure page
				 document.location='index.php?option=mainpage';
			  });
			  
			});
		  }
		  else 
		  {
		  	$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
			{ 
			  //add message and change the class of the box and start fading
			  $(this).html('Error login details...').addClass('messageboxerror').fadeTo(900,1,function(){$(this).hide("normal");});
			});		
          }

        });
 		return false; //not to post the  form physically
	});
	//now call the ajax also focus move from 
	$("#password").blur(function()
	{
		$("#login_form").trigger('submit');
	});
});
{/literal}
</script>
</head>

<body>
<div id="topPan"><a href="index.php"><img src="images/logo.gif" title="Green Solutions" alt="Green Solutions" width="204" height="57" border="0"/></a>

</div>
<div style="height:50px;"></div>
<center>
	<div id="leftPan">
	<div id="leftmemberPan">
	<h2>member <span>login</span></h2>
	<form id="login_form" action="" method="post">
	<label>Login</label>
	  <input type="text" name="username" id="username" value="" maxlength="20" />
	  <label class="emailpadding">Password</label>
	   <input class="fieldpadding" type="password" name="password" id="password" value="" maxlength="20" />
	   <span id="msgbox" style="display:none"></span>
	   <div id="leftPango"><p class="textposition"><a href="index.php?option=users&task=register">Register now</a></p>
	   <input type="submit" class="gobutton" name="submit" id="submit" value="Go" />
	   </div>
	</form>

	</div>
	</div>
</center>


</body>
</html>
